.
<template>
  <vab-card>
    <template #header>
      <div class="flex_sb">
        <div class="flex" v-if="detailInfo">
          <span class="leve_title">
            {{ detailInfo.buyer_customer_name || '' }} 采购单
          </span>
          <span class="default_text">订单编号：{{ detailInfo.order_no }}</span>
          <span class="default_text">
            创建人：{{ detailInfo.create_user_name }}
          </span>
          <span class="default_text">
            创建时间：
            {{ detailInfo.create_at }}
          </span>
        </div>
        <div class="flex">
          <VabButton title="返回" @click="router.go(-1)" />
        </div>
      </div>
    </template>
    <div class="time-line">
      <div
        class="time-line-mode"
        v-for="(item, i) in activities"
        :key="i"
        @click="handlePlan(i + 1)"
      >
        <span class="number" :class="{ active: i + 1 <= orderStatus }">
          {{ i + 1 }}
        </span>
        <span class="title" :class="{ active: i + 1 <= orderStatus }">
          {{ item.title }}
        </span>
        <b v-show="i != 4" :class="{ active: i + 1 <= orderStatus }"></b>
      </div>
    </div>
  </vab-card>
</template>

<script setup lang="ts">
  /**
   * 采购产品信息
   */
  import { _activities } from '../tools'

  defineProps({
    orderStatus: {
      type: Number,
      default: 2,
    },
  })

  const router = useRouter()
  const detailInfo = ref<any>(null)
  const activities = ref<any>([])
  activities.value = _activities

  /**
   * @method
   */

  const emit = defineEmits(['handlePlan'])

  // 获取更新数据
  const getUpdateData = (res: any) => {
    detailInfo.value = res
  }

  // 计划
  const handlePlan = (i: number) => {
    emit('handlePlan', i)
  }

  /**
   * @实例
   */
  defineExpose({
    getUpdateData,
  })
</script>
<style lang="scss" scoped>
  @import '../index.scss';
</style>
